<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>我的课程</title>
    <script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.0.js"></script>
    <script>
        $(document).ready(function(){
            var user = window.localStorage.getItem("username");
            var data = $.parseJSON(user);
            $.post("http://localhost:80/edu/student/selected-courses", {student_id: data.student_id}, function(response) {
                var rs = $.parseJSON(response);
                if (rs.code != "00000") {
                    alert("获取已选课程数据失败");
                    return;
                }
                $.each(rs.data, function(index, course) {
                    // 创建表格行和各个单元格
                    var row = $("<tr></tr>");
                    row.append("<td>" + course.course_id + "</td>");
                    row.append("<td>" + course.course_name + "</td>");
                    row.append("<td>" + course.course_time + "</td>");
                    row.append("<td>" + course.teacher_realname + "</td>");
                    row.append("<td>" + course.current_section_count + "</td>");
                    row.append("<td>" + course.credits_count + "</td>");
                    row.append("<td>" + course.section_count + "</td>");
                    row.append("<td>" + course.my_score + "</td>");
                    row.append("<td>" + course.course_is_pass + "</td>");

                    // 创建查看课程按钮并附加点击事件
                    var viewCourseButton = $("<input type='button' value='查看课程' />");
                    viewCourseButton.click(function() {
                        $(location).attr("href", "user_courses_info.html?course_code=" + course.course_code + "&student_user_id=" + data.student_id);
                    });

                    // 仅当分数低于及格分数时显示补考按钮
                    if (course.my_score < course.pass_score) {
                        var rexamButton = $("<input type='button' value='申请补考' />");
                        rexamButton.click(function() {
                            alert('已申请补考，具体补考时间等待学校通知');
                        });
                        var buttonsCell = $("<td></td>");
                        buttonsCell.append(rexamButton);
                        buttonsCell.append(viewCourseButton);
                        row.append(buttonsCell);
                    } else {
                        var noRexamCell = $("<td></td>");
                        noRexamCell.append(viewCourseButton);
                        noRexamCell.text("不需要补考");
                        row.append(noRexamCell);
                    }

                    // 将表格行添加到表格中
                    $("#mycourses").append(row);
                });
            });

        });
    </script>
    <style>
        .container {
            text-align: center;
        }
    </style>
</head>
<body>
<div class="container">
    <h1>我的课程</h1>
    <a href="all_courses.html">选课</a><br>
    <a href="all_blogs.html">校园论坛</a><br>
    <a href="change_pwd.html">修改密码</a><br>
    <a href="teacher_schedule.html">教师课表</a><br>
    <a href="student_schedule.html">学生课表</a><br>
    <table id="mycourses">
        <thead>
        <tr>
            <th>序号</th>
            <th>课程名称</th>
            <th>课程时间</th>
            <th>任课教师</th>
            <th>当前选课人数</th>
            <th>学分</th>
            <th>课时数</th>
            <th>成绩</th>
            <th>是否合格</th>
            <th>操作</th>
        </tr>
        </thead>
        <tbody>
        </tbody>
    </table>
</div>
</body>
</html>